<template>
	<view>
		<u-sticky bgColor='#fff'>
			<search></search>
			<dropdownCar :indexList="indexList" :brandList="brandList" :modelList="modelList"
				@brandToModel="brandToModel" @selectModel="selectModel" @typeTagsChange="typeTagsChange"
				@priceSelect="priceSelect" @screenSelect="screenSelect" @getAllCar = "getAllCar"></dropdownCar>
			<searchTags ref="searchTagsRef"></searchTags>
		</u-sticky>
		<goodList :list="carList" v-if="carList.length"></goodList>
		<empty text="这里没有找到你要的车型~" v-else></empty>
		<u-loadmore :status="loadingText.status" :loading-text="loadingText.inLoading"
			:loadmore-text="loadingText.beforeLoading" :nomore-text="loadingText.nomoreText" :height="40"
			v-show='carList.length>=params.limit' />
	</view>
</template>

<script>
	import {
		get_car_brand,
		get_car_model,
		get_car
	} from '@/api/contents/buyCar/buyCar.js'

	import search from '@/components/buyCar/search/search.vue'
	import dropdownCar from '@/components/buyCar/uni-dropdown/uni-dropdown.vue'
	import searchTags from '@/components/buyCar/seachTags/seachTags.vue'
	import goodList from '@/components/common/goodList/goodList.vue'
	import empty from '@/components/home/empty/empty.vue'
	export default {
		components: {
			search,
			dropdownCar,
			searchTags,
			goodList,
			empty
		},
		data() {
			return {
				// 汽车品牌列表
				brandList: [],
				// 索引列表
				indexList: [],
				// 汽车品牌车型
				modelList: [],
				// car_params
				params: {
					model_id: 0, //汽车品牌类型
					tag_types: 0, //排序方式 0 智能排序 1 价格最低 2 价格最高 3 座位最多
					price: {},
					car_model: null,
					limit: 10,
					page: 1,
					tag:[]
				},
				//汽车数据
				carList: [],
				loadingText: {
					inLoading: '努力加载中',
					beforeLoading: '上拉加载更多',
					nomoreText: '没有更多了',
					status: 'loadmore'
				}
			};
		},
		methods: {
			getAllCar(){
				this.carList = []
				this.params.model_id = 0
				this.params.page = 1;
				this.getCarInfo()
				
			},
			//首页点击功能区车类型获取数据
			getCarTypeList(options) {
				const carType = options.carType
				if (carType) {
					this.$nextTick(() => {
						this.$refs.searchTagsRef.searchTags.push(carType * 1)
						this.params.tag.push(carType * 1)
						this.getAllCar();
					})
				}
			},
			// 获取汽车品牌列表
			getCarBrand() {
				get_car_brand().then(res => {
					if (res.code == 0) {
						this.brandList = res.data.brand_list;
						this.indexList = res.data.indexList;
					}
				})
			},
			brandToModel(brand_id) {
				get_car_model({
					brand_id
				}).then(res => {
					this.modelList = res.data.list;
				})
			},
			selectModel(model_id) {
				this.params.model_id = model_id;
				this.carList = [];
				this.params.page = 1;
				this.getCarInfo();
			},
			typeTagsChange(tag_types) {
				this.params.tag_types = tag_types;
				this.carList = [];
				this.params.page = 1;
				this.getCarInfo();
			},
			priceSelect(item) {
				this.params.price = item;
				this.carList = [];
				this.params.page = 1;
				this.getCarInfo();
			},
			screenSelect(car_model, seating, drive) {
				this.params.car_model = car_model;
				this.params.seating = seating;
				this.params.energy = drive;
				this.carList=[];
				this.params.page=1;
				this.getCarInfo();
			},
			getCarInfo() {
				console.log(this.carList);
				let params = {}
				params.page = this.params.page;
				params.limit = this.params.limit;
				params.tag_types = this.params.tag_types;
				if (this.params.car_model >= 0) {
					params.car_model = this.params.car_model
				}
				if (this.params.model_id > 0) {
					params.model_id = this.params.model_id
				}
				if (this.params.seating > 0) {
					params.seating = this.params.seating
				}
				if (this.params.energy !== undefined) {
					params.energy = this.params.energy
				}
				if(this.params.tag.length){
					console.log(this.params.tag);
					params.tag = this.params.tag.join(',')
				}
				get_car(params).then(res => {
					if (res.code == 0) {
						if (res.data.list.length) {
							this.carList = [...this.carList, ...res.data.list]
							this.loadingText.status = 'loadmore';
						} else {
							this.loadingText.status = 'nomore'
						}
						console.log(this.carList);
					}
				})
			}
		},
		onLoad(options) {
			// 首页跳转买车页面
			// #ifdef APP-PLUS
			this.getCarTypeList(options);
			// #endif
			this.getCarInfo();
		},
		onShow() {
			// 首页跳转买车页面
			// #ifdef MP-WEIXIN || H5
			this.getCarTypeList(getCurrentPages()[0].options);
			// #endif
			this.getCarBrand()
		},
		onReachBottom() {
			this.loadingText.status = 'loading';
			this.params.page++;
			this.getCarInfo();
		},
	}
</script>

<style lang="scss">

</style>
